<template>
<transition name="slide">
  <music-list :songs="songs" :title="title" :bg-image="bgImage"></music-list>
    </transition>
</template>

<script type="text/ecmascript-6">

import musicList from 'components/music-list/music-list'
import {mapGetters} from 'vuex'
import {getSongList} from 'api/recommend'
import {ERR_OK} from 'api/config'
import {createSong} from 'common/js/song'
export default{
  name:'',
    data(){
      return{
      songs:[]
    }},
    created(){
    	this._getSinglist()
    },
  computed:{
  	title(){
return this.disc.dissname
  	},
  	bgImage(){
return this.disc.imgurl
  	},
  ...mapGetters(['disc'])
  },
  methods:{
// 获取歌手列表,//判断是否有id,否则退出
_getSinglist(){
	if(!this.disc.dissid){
		this.$router.push('/recommend');
		return
	}
	getSongList(this.disc.dissid).then((res) => {
		console.log(res)
		if (res.code === ERR_OK) {
			this.songs=this._dealData(res.cdlist[0].songlist)
		}
	})
	},
	// 格式化数据
	_dealData(list){
		let ret =[]
		list.forEach((musicData)=>{
			if(musicData.songid&&musicData.albumid){
				ret.push(createSong(musicData))
			}
		})
		return ret;
	}

},

  components:{musicList}
}
</script>

<style rel="stylesheet" lang="less">

  .slide-enter-active,.slide-leave-active{
  	transition: all 0.3s;
  }
  .slide-enter,.slide-leave-to{
    transform: translate3d(100%, 0, 0);
  }
</style>
